<template>
    <div class="page">
        <!-- 导航栏 -->
        <div class="navBar">
            <customNavBar :leftTetx=leftTetx :titleTest=titleTest></customNavBar>
        </div>
        <!-- 页面内容 -->
        <div class="content">
            <!-- <van-form @failed="onFailed"> -->
            <van-cell-group inset style="margin-top: 16px; ">
                <!-- 姓名-->
                <van-field label="姓名" name="姓名" v-model="userName" readonly />
                <!-- 性别 -->
                <van-field label="性别" name="性别" v-model="sex" readonly />
                <!-- 年龄 -->
                <van-field label="年龄" name="年龄" v-model="age" readonly />
            </van-cell-group>
            <!-- </van-form> -->
        </div>
    </div>
</template>

<script lang="ts" setup name="addCustomers">
import { useRouter, useRoute } from "vue-router"
import { Toast } from '/@/utils/Message';
import { onMounted } from "vue"
import { reactive, ref } from 'vue'
import { customDetail } from "/@/api/auth/addCustome"
import customNavBar from "/src/components/NavBar/customNavBar.vue"
const router = useRouter()
const route = useRoute();
let data = reactive({
   ...route.query
});
const leftTetx = ref("")
const titleTest = ref("客户详情")
const userName = ref("")
const sex = ref("")
const age = ref("")
onMounted (()=>{
    customDetail(data).then((res: any) => {
        userName.value = res.customDetail.customName
        sex.value = res.customDetail.sex == '0' ? '男' : '女'
        age.value = res.customDetail.age
    })
})
</script>

<!-- less嵌套设置 -->
<style lang="less" scoped>
.page {
    background-color:#F5F7FA;
    height: 100vh;
    width: 100vw;
    overflow: hidden;

    .navBar {
        :deep(.van-nav-bar) {
            background-color: white;
        }

        :deep(.van-nav-bar__content) {
            background-color: white;
        }
    }



    .content {
        height: 100%;
        width: 100%;
        padding-top: 68px;
        overflow: hidden;
        box-sizing: border-box;

        :deep(.van-field__control){
            text-align: right;
        }

        //行高度设置
        :deep(.van-cell){
            line-height: 58px;
        }

    }
}
</style>


<!-- 
     姓名	仅展示	文本
     性别	仅展示	文本
     年龄	仅展示	文本 
    
    -->
